<template>
  <grimm-page type="button-view" title="Radio-Group">
    <template slot="content">
      <div disabled>
        <h1 class="example-page-title">默认样式</h1>
        <grimm-radio-group 
          v-model="checked" 
          :options="options" 
          :onChangeAfter="onChangeAfter"
        />
        radio-group:{{checked}}
        <h1 class="example-page-title">block样式</h1>
        <grimm-radio-group 
          v-model="checked2" 
          :options="options"
          :onChangeAfter="onChangeAfter"
          fix="prefix"
          display
          original
        />
        radio-group:{{checked2}}
      </div>
    </template>
  </grimm-page>
</template>

<script>
import GrimmPage from 'example/components/GrimmPage.vue';
export default {
  data() {
    return {
      checked: 'o1',
      checked2: 'o1',
      options: [
        {
          label: 'radio',
          value: 'o1',
        },
        {
          label: 'radio',
          value: 'o2',
        },
      ],
    };
  },
  methods: {
    onChangeAfter(vals, opts) {},
  },
  components: {
    GrimmPage,
  },
};
</script>
